function loadImgError(evt) {
  evt.target.dataset.v_lazy_error = "true";
  evt.target.src = errImg;
}
function loadImgSucc(evt) {
  evt.target.dataset.v_lazy_loaded = "true";
}
function intersectionCallback(entries, observer) {
  entries.forEach((entry: IntersectionObserverEntry, idx) => {
    if (entry.isIntersecting) {
      const el = entry.target as HTMLImageElement;
      if (!el.dataset.v_lazy_error && el.dataset.v_lazy_loaded) return;
      el.src = el.dataset.v_lazy_src;
      el.onerror = loadImgError;
      el.onload = loadImgSucc;
    }
  });
}
const observer = new IntersectionObserver(intersectionCallback, {
  threshold: 0
});
const loadImg = "/images/img-loading.svg";
const errImg = "/images/img-error.svg";
export default {
  mounted(el: HTMLImageElement, binding) {
    el.dataset.v_lazy_src = binding.value;
    el.src = loadImg;
    observer.observe(el);
  },
  updated(el: HTMLImageElement, binding) {
    el.dataset.v_lazy_src = binding.value;
  },
  unmounted(el: HTMLImageElement, binding) {
    observer.unobserve(el);
  }
};
